<html>
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="/stylesheets/css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="/stylesheets/css/bootstrap-theme.min.css" />
    <link rel="stylesheet" type="text/css" href="/stylesheets/css/style.css"/>
    <link rel="stylesheet" type="text/css" href="/stylesheets/css/pikaday.css"/>
    <script type="text/javascript" src="/javascripts/jquery.js"></script>
    <script type="text/javascript" src="/javascripts/bootstrap.min.js"></script>
    <script type="text/javascript" src="/javascripts/pikaday.min.js"></script>

    <script>
        function mrSub(){
            var cpId = document.getElementById('cpId').value;
            var mrdate = document.getElementById('mrdId').value;
            var ep = document.getElementById('ep').value;
            var qp = document.getElementById('qp').value;
            var wa = document.getElementById('wa').value;
            var mrcon = document.getElementById('con').value;
            if(mrdate ==''){
                alert('返修时间不能为空！');
                document.getElementById('mrdId').focus();
                return false;
            }else if(ep ==''){
                alert('返修入库人不能为空！');
                document.getElementById('ep').focus();
                return false;
            }else if(qp ==''){
                alert('返修质检人不能为空！');
                document.getElementById('qp').focus();
                return false;
            }else if(wa ==''){
                alert('入库管理员不能为空！');
                document.getElementById('wa').focus();
                return false;
            }else if(mrcon==''){
                alert('返修原因不能为空！');
                document.getElementById('con').focus();
                return false;
            }else{
                $.post('mobileAddMr',{cpId:cpId,mrd:mrdate,ep:ep,qp:qp,wa:wa,mrcon:mrcon},function(data){
                    if(data=='1'){
                        $('.close').click();
                        document.getElementById('mrdId').value = '';
                        document.getElementById('ep').value = '';
                        document.getElementById('qp').value = '';
                        document.getElementById('wa').value = '';
                        document.getElementById('con').value = '';
                        alert('添加成功！');
                    }else{
                        alert('添加失败！');
                    }
                },'json');
                return true;
            }
        };
        function deleteMr(mrId){
            var cpId = document.getElementById('cpId').value;
            $.post('mobileDeleteMr',{cpId:cpId,mrId:mrId},function(data){
                if(data=='1'){
                    //$('.close').click();
                    mobileFindMr(cpId);
                    alert('删除成功！');
                }else{
                    alert('删除失败！');
                }
            },'json');
        };
        function searchCp(){
            var sn = document.getElementById('searchSN').value;
            var pn = document.getElementById('searchPN').value;
            var tp = document.getElementById('searchTP').value;
            var ds = document.getElementById('searchDS').value;
            var sr = document.getElementById('searchResult');
            sr.innerHTML = '';
            $.post('mobileSearchCp',{sn:sn,pn:pn,tp:tp,ds:ds},function(data){
                if(data=='0'){
                    sr.innerHTML='无数据！';
                }else{
                    var divData = '';
                    for(var i=0;i<data.length;i++){
                        divData += '<div href="#" class="list-group-item"><div class="table-responsive"><table class="table table-hover"><tbody>'+
                                '<tr><td><span class="label label-success">SN</span></td>'+
                                '<td><a href="javascript:void(0)" onclick="javascript:moInfo('+"'"+data[i]._id+"'"+');"><span class="label label-default">'+data[i].sn+'</span></a></td></tr>'+
                                '<tr><td><span class="label label-success">产品名称</span></td>'+
                                '<td><span class="label label-default">'+data[i].pn+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">出厂日期</span></td>'+
                                '<td><span class="label label-default">'+data[i].cd+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">部署地</span></td>'+
                                '<td><span class="label label-default">'+data[i].ds+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">批号</span></td>'+
                                '<td><span class="label label-default">'+data[i].bn+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">型号</span></td>'+
                                '<td><span class="label label-default">'+data[i].tp+'</span></td></tr></tbody></table></div></div>';
                    }
                    sr.innerHTML = divData;
                }
            },'json');
        };
        function moInfo(cpId){
            var temp = document.createElement("form");
            temp.action = 'mobileCpInfo';
            temp.method = "post";
            temp.style.display = "none";
            var opt = document.createElement("textarea");
            opt.name = 'cpId';
            opt.value = cpId;
            temp.appendChild(opt);
            document.body.appendChild(temp);
            temp.submit();
            return temp;
        };
        function mobileFindMr(cpId){
            var mrsDiv = document.getElementById('mrsView');
            mrsDiv.innerHTML = '';
            $.post('mobileFindMr',{cpId:cpId},function(data){
                if(data=='0'){
                    mrsDiv.innerHTML = '没有查到维修记录！';
                }else{
                    var divData = '';
                    for(var i=0;i<data.length;i++){
                        divData+='<a class="btn btn-success btn-sm badge" href="javascript:void(0)" onclick="javascript:deleteMr('+"'"+data[i]._id+"'"+')">删除</a>'+
                                '<div class="table-responsive"><table class="table table-hover"><tbody>'+
                                '<tr><td><span class="label label-success">返修时间</span></td><td><span class="label label-default">'+data[i].md+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">返修入库人</span></td><td><span class="label label-default">'+data[i].me+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">返修质检人</span></td><td><span class="label label-default">'+data[i].mqp+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">入库管理员</span></td><td><span class="label label-default">'+data[i].mwa+'</span></td></tr>'+
                                '<tr><td><span class="label label-success">返修原因</span></td><td><span class="label label-default">'+data[i].con+'</span></td></tr>'+
                                '</tbody></table></div>';
                    }
                    mrsDiv.innerHTML = divData;
                }
            },'json');
        };
        function mobileFindAss(ass){
            var assDiv = document.getElementById('assView');
            assDiv.innerHTML = '';
            $.post('mobileFindAss',{ass:ass},function(data){
                if(data=='0'){
                    assDiv.innerHTML = '没有查到组件信息！';
                }else{
                    var tbodyHTML = '<table class="table table-condensed table-bordered "><thead><tr><th>PN</th><th>名称</th><th>型号</th><th>版本</th><th>生产日期</th><th>厂商</th><th>批号</th><th>产地</th><th>发往地</th><th>用户</th></tr></thead><tbody>';
                    $.each(data,function(InforIndex,Info){
                        tbodyHTML += '<tr>';
                        tbodyHTML += '<td>'+Info["pasn"]+'</td><td>'+Info["pana"]+'</td><td>'+Info["patp"]+'</td><td>'+Info["pavn"]+'</td><td>'+Info["pada"]+'</td>';
                        tbodyHTML += '<td>'+Info["pami"]+'</td><td>'+Info["pabn"]+'</td><td>'+Info["papa"]+'</td><td>'+Info["pads"]+'</td><td>'+Info["paus"]+'</td>';
                        tbodyHTML += '</tr>';
                    });
                    tbodyHTML +='</tbody></table>';
                    assDiv.innerHTML = tbodyHTML;
                }
            },'json');
        };
    </script>
    <style>

    </style>
</head>

<body>
<div class="container">
<ul id="myTab" class="nav nav-pills">
    <li class="active">
        <a href="#home" data-toggle="tab"><h4>主页面</h4></a>
    </li>
    <li>
        <a href="#search" data-toggle="tab"><h4>高级搜索</h4></a>
    </li>
    <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#"><h4>用户<span class="caret"></span></h4></a>
        <ul class="dropdown-menu">
            <li>
                <a href="<%=cp.sn%>">退出</a>
            </li>
            <li class="divider"></li>
        </ul>
    </li>
</ul>

<div id="myTabContent" class="tab-content">

<div class="tab-pane fade in active" id="home">
    <div class="table-responsive">
        <table class="table table-hover">
            <tbody>
            <tr>
                <td>Barcode：</td>
                <td><%=cp.sn%></td>
            </tr>
            <tr>
                <td>产品名称：</td>
                <td><%=cp.pn%></td>
            </tr>
            <tr>
                <td>出厂日期：</td>
                <td><%=cp.cd%></td>
            </tr>
            <tr>
                <td>部署地：</td>
                <td><%=cp.ds%></td>
            </tr>
            <tr>
                <td>批号：</td>
                <td><%=cp.bn%></td>
            </tr>
            <tr>
                <td>型号：</td>
                <td><%=cp.tp%></td>
            </tr>
            <tr>
                <td>入库时间：</td>
                <td><%=cp.isd%></td>
            </tr>
            <tr>
                <td>入库质检人：</td>
                <td><%=cp.isqp%></td>
            </tr>
            <tr>
                <td>入库管理员：</td>
                <td><%=cp.iswa%></td>
            </tr>
            <tr>
                <td>质保期：</td>
                <td><%=cp.war%></td>
            </tr>
            <tr>
                <td>出库时间：</td>
                <td><%=cp.osd%></td>
            </tr>
            <tr>
                <td>出库管理员：</td>
                <td><%=cp.oswa%></td>
            </tr>
            <tr>
                <td>提货性质：</td>
                <td><%=cp.na%></td>
            </tr>
            <tr>
                <td>提货人：</td>
                <td><%=cp.bp%></td>
            </tr>
            </tr>
            <tr>
                <td>返修记录：</td>
                <td><a data-toggle="modal" class="btn btn-success btn-sm" data-target="#fix_search" onclick="mobileFindMr('<%=cp._id%>');">查看返修记录</a>&nbsp;&nbsp;<a data-toggle="modal" class="btn btn-success btn-sm badge" data-target="#fix_add">+</a></td>
            </tr>
            <tr>
                <td>产品规格：</td>
                <td><a data-toggle="modal" class="btn btn-success btn-sm" data-target="#sds_search">查看产品规格</a></td>
            </tr>
            </tr>
            <tr>
                <td>特殊属性：</td>
                <td><a data-toggle="modal" class="btn btn-success btn-sm" data-target="#sps_search">查看特殊属性</a></td>
            </tr>
            <tr>
                <td>产品组件：</td>
                <td><a data-toggle="modal" class="btn btn-success btn-sm" data-target="#ass_search" onclick="mobileFindAss('<%=cp.ass%>');">查看产品组件</a></td>
            </tr>
            </tbody>
        </table>
    </div>
</div>

<!-- 查看维修记录页面 -->
<div class="modal fade" id="fix_search" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">查看返修记录 </h4>
            </div>
            <div class="modal-body">
                <div class="list-group">
                    <div id="mrsView" href="#" class="list-group-item">

                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <a href="#" class="btn btn-success btn-large" data-dismiss="modal">确定</a>
            </div>
        </div>
    </div>
</div>

<!--查看产品组件dialog-->
<div class="modal fade" id="ass_search" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">查看产品组件 </h4>
            </div>
            <div class="modal-body" >
                <div class="table-responsive " id="assView">
                </div>
            </div>
            <div class="modal-footer">
                <a href="#" class="btn btn-success btn-large" data-dismiss="modal">确定</a>
            </div>
        </div>
    </div>
</div>

<!-- 添加维修记录页面 -->
<div class="modal fade" id="fix_add" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">添加返修记录 </h4>
            </div>
            <div class="modal-body">
                <div class="table-responsive">
                    <table class="table table-hover">
                        <input type="hidden" id="cpId" value="<%=cp._id%>"/>
                        <tbody>
                        <tr>
                            <td><span class="label label-success">返修时间</span>&nbsp;&nbsp;<font color="red">*</font></td>
                            <td>
                                <input type="text" class="form-control" id="mrdId" name="mrdate" readonly>
                                <script type="text/javascript">
                                    var picker = new Pikaday(
                                            {
                                                field: document.getElementById('mrdId'),
                                                firstDay: 1,
                                                minDate: new Date('2010-01-01'),
                                                maxDate: new Date('2020-12-31'),
                                                yearRange: [2000,2020]
                                            });
                                </script>
                            </td>
                        </tr>
                        <tr>
                            <td><span class="label label-success">返修入库人</span>&nbsp;&nbsp;<font color="red">*</font></td>
                            <td>
                                <input type="text" class="form-control" name="mrep" id="ep">
                            </td>
                        </tr>
                        <tr>
                            <td><span class="label label-success">返修质检人</span>&nbsp;&nbsp;<font color="red">*</font></td>
                            <td>
                                <input type="text" class="form-control" id="qp" name="mrqp">
                            </td>
                        </tr>
                        <tr>
                            <td><span class="label label-success">入库管理员</span>&nbsp;&nbsp;<font color="red">*</font></td>
                            <td>
                                <input type="text" class="form-control" id="wa" name="mrwa">
                            </td>
                        </tr>
                        <tr>
                            <td><span class="label label-success">返修原因</span>&nbsp;&nbsp;<font color="red">*</font></td>
                            <td><textarea class="form-control" id="con" name="mrcon"></textarea></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <a href="javascript:void(0)" onclick="return mrSub();" class="btn btn-success btn-large">保存</a>
            </div>
        </div>
    </div>
</div>

<!-- 查看产品规格页面 -->
<div class="modal fade" id="sds_search" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">查看产品规格 </h4>
            </div>
            <div class="modal-body">
                <div class="table-responsive">
                    <table class="table table-hover">
                        <tbody>
                        <tr>
                            <td><span class="label label-success">规格名称</span></td>
                            <td><span class="label label-success">规格值</span></td>
                        </tr>
                        <%sds.forEach(function(sd){%>
                            <tr>
                                <td><span class="label label-default"><%=sd.sk%></span></td>
                                <td><span class="label label-default"><%=sd.sv%></span></td>
                            </tr>
                        <%})%>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <a href="#" class="btn btn-success btn-large" data-dismiss="modal">确定</a>
            </div>
        </div>
    </div>
</div>

<!-- 查看特殊属性页面 -->
<div class="modal fade" id="sps_search" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">查看特殊属性 </h4>
            </div>
            <div class="modal-body">
                <div class="table-responsive">
                    <table class="table table-hover">
                        <tbody>
                        <tr>
                            <td><span class="label label-success">属性名称</span></td>
                            <td><span class="label label-success">属性值</span></td>
                        </tr>
                        <%sps.forEach(function(sp){%>
                            <tr>
                                <td><span class="label label-default"><%=sp.pk%></span></td>
                                <td><span class="label label-default"><%=sp.pv%></span></td>
                            </tr>
                        <%})%>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <a href="#" class="btn btn-success btn-large" data-dismiss="modal">确定</a>
            </div>
        </div>
    </div>
</div>

<!--高级搜索form dialog-->
<div class="tab-pane fade" id="search">
    <div class="table-responsive">
        <table class="table table-hover">
            <tbody>
            <tr>
                <td>Barcode</td>
                <td>
                    <input type="text" id="searchSN" class="form-control">
                </td>
            </tr>
            <tr>
                <td>产品名称</td>
                <td>
                    <input type="text" id="searchPN" class="form-control">
                </td>
            </tr>
            <tr>
                <td>产品型号</td>
                <td>
                    <input type="text" id="searchTP" class="form-control">
                </td>
            </tr>
            <tr>
                <td>部署地</td>
                <td>
                    <input type="text" id="searchDS" class="form-control">
                </td>
            </tr>
            <tr>
                <td></td>
                <td><a data-toggle="modal" href="javascript:void(0)" onclick="searchCp();" class="btn btn-success btn-large" data-target="#advanced_search"> 搜索 </a></td>
            </tr>
            </tbody>
        </table>
    </div>
</div>

<!-- 高级搜索页面 -->
<div class="modal fade" id="advanced_search" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close"
                        data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 id="myModalLabel" class="modal-title">高级搜索 </h4>
            </div>
            <div class="modal-body">
                <div id="searchResult" class="list-group">

                </div>
            </div>
            <div class="modal-footer">
                <a href="#" class="btn btn-success btn-large" data-dismiss="modal">确定</a>
            </div>
        </div>
    </div>
</div>

</div>
</div>
</body>
</html>